<div class="competitor-analysis-page">
    <!-- 页面标题 -->
    <div class="mb-4">
        <h2>📈 竞品分析</h2>
        <p class="text-muted">查看我方产品与竞品的对比情况</p>
    </div>

    <!-- 选择我方产品 -->
    <div class="card mb-4">
        <div class="card-body">
            <div class="row g-3">
                <div class="col-md-4">
                    <label class="form-label">选择我方产品</label>
                    <select class="form-select" id="selectOurProduct">
                        <option value="">请选择...</option>
                    </select>
                </div>
                <div class="col-md-2">
                    <label class="form-label">&nbsp;</label>
                    <button class="btn btn-primary w-100" onclick="competitorAnalysis.analyze()">
                        🔍 开始分析
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- 分析结果区域 -->
    <div id="analysisResult" style="display: none;">
        <!-- 产品基本信息 -->
        <div class="card mb-4">
            <div class="card-header bg-primary text-white">
                <h5 class="mb-0">产品信息</h5>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-md-3">
                        <strong>产品名称：</strong><span id="productName"></span>
                    </div>
                    <div class="col-md-2">
                        <strong>品牌：</strong><span id="productBrand"></span>
                    </div>
                    <div class="col-md-2">
                        <strong>类别：</strong><span id="productCategory"></span>
                    </div>
                    <div class="col-md-2">
                        <strong>价格：</strong><span id="productPrice"></span>
                    </div>
                    <div class="col-md-3">
                        <strong>关注度：</strong><span id="productFocus"></span>
                    </div>
                </div>
            </div>
        </div>

        <!-- 竞品列表 -->
        <div class="card">
            <div class="card-header">
                <h5 class="mb-0">竞品列表（<span id="competitorCount">0</span>个）</h5>
            </div>
            <div class="card-body">
                <!-- 竞品统计 -->
                <div class="row mb-3">
                    <div class="col-md-4">
                        <div class="alert alert-danger">
                            直接竞品：<strong id="directCount">0</strong> 个
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="alert alert-warning">
                            间接竞品：<strong id="indirectCount">0</strong> 个
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="alert alert-info">
                            强竞争：<strong id="highStrengthCount">0</strong> 个
                        </div>
                    </div>
                </div>

                <!-- 竞品表格 -->
                <table class="table table-bordered table-hover">
                    <thead class="table-light">
                        <tr>
                            <th width="200">竞品名称</th>
                            <th width="100">品牌</th>
                            <th width="120">价格区间</th>
                            <th width="100">竞争类型</th>
                            <th width="100">竞争强度</th>
                            <th width="120">竞争维度</th>
                            <th>竞争说明</th>
                        </tr>
                    </thead>
                    <tbody id="competitorTableBody">
                        <!-- 动态加载 -->
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- 空状态 -->
    <div id="emptyState" class="text-center py-5">
        <div class="text-muted">
            <h4>请选择我方产品开始分析</h4>
            <p>从上方下拉框选择一个我方产品，查看其竞品情况</p>
        </div>
    </div>
</div>

<!-- 加载竞品分析JS -->
<script src="/assets/js/pages/competitor-analysis.js?v=20251011-4"></script>

